import React from 'react'
import { View, StyleSheet, Text, TouchableOpacity } from 'react-native'
import flex from '../../../configs/flex'
import fontsize from '../../../configs/fontsize'
import Icon from '../../public/icon'
import { px2dp } from 'rn-xiaobu-utils'

export default class BusInfo extends React.Component {
  constructor (props) {
    super(props)
    this.state = {
      showSchedule: true
    }
  }
  render () {
    return (
      <View>
        <View style={[styles.wrapper, flex.flexV]}>
          <View style={[flex.flexH, flex.flexHsb]}>
            <View style={[flex.flexH, flex.flexVc]}>
              <Text style={[fontsize.fontsize28, styles.boldFont]}>{this.props.businfo.startStation}</Text>
              <Icon color={'#999999'} name={'next'}
                size={22}></Icon>
              <Text style={[fontsize.fontsize28, styles.boldFont]}>{this.props.businfo.endStation}</Text>
            </View>
            <TouchableOpacity onPress={()=>{ this.props.changeDirction() }}>
              <Icon name={'revesing'} size={36}/>
            </TouchableOpacity>
          </View>
          <Text style={[styles.price, fontsize.fontsize22]}>
            {/* 票价：{(this.props.price / 100).toFixed(2)}元 */}
          票价：{this.props.price}元
          </Text>
        </View>
      </View>
    )
  }
}

const styles = StyleSheet.create({
  wrapper: {
    width: px2dp(750),
    padding: px2dp(30),
    backgroundColor: '#ffffff'
  },
  boldFont: {
    fontWeight: 'bold'
  },
  price: {
    color: '#999999',
    marginTop: px2dp(17)
  },
  timeWrapper: {
    backgroundColor: '#F9FAFA',
    width: px2dp(750),
    height: px2dp(100),
    paddingHorizontal: px2dp(30)
  },
  timeInfoText: {
    color: '#999999',
    marginBottom: px2dp(10)
  },
  marginSpace: {
    marginRight: px2dp(60)
  }
})